<!--
- Author:  LiShibin.
- Date:    2017/10/19 0019.
- File:    成员已分配的植物列表.
-->
<template>
  <div class="Web_Box"
    v-infinite-scroll="loadMore"
    infinite-scroll-disabled="false"
    infinite-scroll-distance="0"
    infinite-scroll-immediate-check="false">
    <div class="bg_fff mb10" v-for="plant in plantList.data">
      <div class="diary">
        <ul class=" f-cb">
          <li class="d_imgs"><a><img :src="$config.imgsite + $config.uploadImgSrc + plant.flower_image + '_w150'"></a>
          </li>
          <li class="pl20 w400"><a>
            <h3 class="d_tits">{{plant.flower_name}}</h3>
          </a>
          </li>
        </ul>
      </div>
    </div>
    <div class="buttonfinish"><a @click="back">返回</a></div>
    <loading-more :allLoaded="plantList.allLoaded" :show="plantList.data.length > 0"></loading-more>
    <empty-data :show="plantList.allLoaded && plantList.data.length <= 0"></empty-data>
  </div>
</template>

<script>
  export default{
    data() {
      return {
        gardenId: this.$route.query.garden,
        memberId: this.$route.query.member,
        plantList: {requested: false, loading: false, allLoaded: false, page: 1, pageSize: 10, data: []}
      }
    },
    components: {},
    created() {
      this.getMemberDistributedPlantList(this.plantList.page, this.plantList.pageSize)
    },
    methods: {
      back() {
        this.$router.go(-1)
      },
      switchSelected(plant, boolValue) {
        if (plant.selected) {
          plant.selected = boolValue
        } else {
          this.$set(plant, 'selected', boolValue)
        }
      },
      getMemberDistributedPlantList(page, pageSize) {
        this.plantList.loading = true
        let param = {member_id: this.memberId, sg_id: this.gardenId, page: page, pageSize: pageSize}
        this.$request.getMemberDistributedPlantList(param).then(data => {
          if (data.length < this.plantList.pageSize) {
            this.plantList.allLoaded = true
          }
          this.plantList.data = [...this.plantList.data, ...data]
        }).finally(() => {
          this.plantList.requested = true
          this.plantList.loading = false
        })
      },
      loadMore() {
        if (this.plantList.loading || this.plantList.allLoaded) { // 正在加载 或 已取得全部数据
          return
        }
        setTimeout(() => {
          this.getMemberDistributedPlantList(++this.plantList.page, this.plantList.pageSize)
        }, 500)
      }
    }
  }
</script>

<style>

</style>